<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Chapter 4: Everything's An Illusion</title>

<link rel="shortcut icon" href="images/2reading.gif">
<link href="foti.css" rel="stylesheet" type="text/css">

<style type="text/css">
#canvas {
	width: 800px;
	height: 600px;
	background: #fff;
	margin: 10px auto 0 auto;
	border: 5px double #aa9e8c;
}

#bg, #char {display: none;}

</style>


<script type="text/javascript">
var vc, vctx, vi1, bgr;
	function init(){
		vc = document.getElementById("canvas");
		vctx = vc.getContext("2d");
		bgr = document.getElementById("bg");
		vctx.drawImage(bgr,0,0,800,600);
		vi1 = document.getElementById("char");
		setInterval("animation()",900);		
	}
	
	var dax=0; counter=0;
	function animation(){
		if(counter >= 5) counter = 0; else counter++;
		vctx.drawImage(bgr,0,0,800,600);
		vctx.drawImage(vi1,dax,0,800,600,0,0,800,600);
		dax=800*counter;

	}
</script>


</head>
<body onload="init()">


	<h1>FIGMENT OF THE IMAGINATION</h1>
	<h2>Chapter 4: Everything's An Illusion</h2>
	<h2>Scene 3: A Conversation With John</h2>


<center><img src="images/line divider.png" width=800 style="opacity: .7;"></center>

<div id="content">

<center><canvas id="canvas" width=800 height=600></canvas></center>

<center><img src="images/photo.png" width=800 style="margin:-5px 0 0 0;"></center>
<img id="bg" src="images/ch4/BGlocker2.png" width=800 height=600>
<img id="char" src="images/ch4/adajohnlocker.png">

<div id="scenetext">
<p>
Astoundingly, the pain was gone, replaced by her thudding heart. "Hey Ada! Are you okay?" he asked. 
"Yeah. I'm grand!" she responded, unable to suppress her smile. "You've been grasping your head since 
first period. And when you passed by me, you suddenly looked really sick. Somehow I felt like I gave 
you a headache or something." "Is he concerned about my health?" she thought. "No. You certainly did 
not give me this headache. Surprisingly though, it's gone! I guess you're the cure. Idiot. Too 
obvious." "Well if that's the case, I should hang out with you more often," he chuckled. "Yes! You totes 
should. Haha. Now you just totally exposed your feelings for him." "Cool. I'll see you around, Ada!"

</p>

<center><img src="images/line divider.png" width=800 style="opacity: .7;"></center>
	
</div>

<div align="center" style="padding-bottom: 30px;">
<a href="Chapter4Scene2.jsp" title="Locker Rage"><button id="button">BACK</button></a>
<a href="tableofcontent.jsp" title="Back to Table of Contents"><button id="button2">TABLE OF CONTENTS</button></a>
<a href="Chapter4Scene4.jsp" title="Reality or Vagary?"><button id="button">NEXT</button></a>
</div>

</div>


</body>
</html>

